:root {
  --transition--time: 0.28s; // 过渡时间
  --sidebar--width: 210px; // 侧边栏宽度
}

// base color
$color: #4285f4; // 默认主题色
$blue: #324157;
$light-blue: #3a71a8;
$red: #c03639;
$pink: #e65d6e;
$green: #30b08f;
$tiffany: #4ab7bd;
$yellow: #fec171;
$panGreen: #30b08f;
$borderB: #b7cfe7; // 边框颜色
$transitionTime: var(--transition--time); // 菜单折叠过渡时间

// 顶部页眉
$eyebrowHeight: 70px; // 顶部页眉高度
$eyebrowBgc: #4385f5; // 顶部页眉背景色

// 顶部导航
$navbarHeight: 40px; // 顶部导航条高度
$operationNavHeight: 40px; // 功能导航高度
$navbarBgc: #004c99; // 顶部导航条背景色
$topNavHeight: $eyebrowHeight + $navbarHeight + $operationNavHeight; // 内容距离顶部高度

// 侧边栏
$menuText: #333333; // 菜单颜色
$menuActiveText: #0099ff; // 菜单选中颜色
$subMenuActiveText: #333333; // 子菜单选中时父级颜色
$hideSidebarWidth: 54px; // 侧边栏折叠后的宽度
$menuBg: #f3f9ff; // 菜单背景色
$sideBarBgc: #f3f9ff; // 侧边栏整体背景色

$menuHover: #0099ff;
$menuHoverText: #0099ff;
$menuHoverBgc: #f3f9ff;

$subMenuBg: #f3f9ff; // 子菜单背景色
$subMenuHover: #f3f9ff; // 子菜单hover背景色
$sideBarWidth: var(--sidebar--width); // 侧边栏宽度

// the :export directive is the magic sauce for webpack
// https://www.bluematador.com/blog/how-to-share-variables-between-js-and-sass
:export {
  menuText: $menuText;
  menuActiveText: $menuActiveText;
  subMenuActiveText: $subMenuActiveText;
  menuBg: $menuBg;
  sideBarBgc: $menuBg;
  menuHover: $menuHover;
  subMenuBg: $subMenuBg;
  subMenuHover: $subMenuHover;
  sideBarWidth: $sideBarWidth;
  eyebrowHeight: $eyebrowHeight;
}
